<template>
    <div class="container">
        <h1>用户登录</h1>
        <div class="username xk">
            <span>用户名：</span>
            <input type="text" placeholder="请输入用户名" name="username">
        </div>
        <div class="password xk">
            <span>密码：</span>
            <input type="passeword" placeholder="请输入密码" name="pwd">
        </div>
        <div class="xk">
            <button type="submit"><a href="./index.html">登录</a></button>
        </div>
        <!-- <div class="fpwd xk">
            
        </div> -->
    </div>
</template>

<script >
    module.exports = {

    }
</script>

<style scoped>
    /* .fpwd {
        padding-left: 100px;
    } */
    a {
        margin: 0 auto;
        color: #ccc;
        font-size: small;
        text-decoration:none;
    }
    .container {
        background-color: rgba(240, 240, 240, 0.5);
        margin: 100px auto;
        height: 408px;
        width: 500px;
        /* display: flex; */
        padding: 50px 10%;
        border-radius: 20px;
    }
    .xk{
        height: 4%;
        margin-top: 15%;
        display: flex;
    }
    .xk>span{
        display: block;
        width: 17%;
        height: 100%;
        margin-left: 10%;
        font-size:2ch;
        padding: 3px;
    }
    .xk>input{
        height: 30px;
        width: 59%;
        border-radius: 10px;
    }
    button{
        margin: 0 auto;
        width: 200px;
        height: 40px;
        background-color:rgb(48,198,203);
        border-radius: 10px;
    }
    .container h1 {
        text-align: center;
    }
</style>